<template>
    <el-form :inline="true" class="demo-form-inline" size="small">
        <el-form-item label="" v-if="$listeners['searchFun']">
            <el-input
                    v-model="queryData"
                    :placeholder="searchPlaceholder"
                    clearable
                    @keyup.enter.native="query"
            ></el-input>
        </el-form-item>
        <slot></slot>
        <el-form-item v-if="showButton">
            <el-button type="primary" @click="query" v-if="$listeners['searchFun']" plain>搜索
            </el-button
            >
            <el-button
                    type="primary"
                    @click="add"
                    size="small"
                    v-has-permi="['Create']"
                    v-if="$listeners['addFun']"

            >新增
            </el-button
            >
            <el-button
                    type="primary"
                    @click="exportExcel"
                    size="small"
                    plain
                    v-has-permi="['daochu']"
                    v-if="$listeners['exportFun']&&showExport"
            >导出
            </el-button
            >
            <slot name="other-button"></slot>
        </el-form-item>
    </el-form>
</template>

<script>
    export default {
        name: "topSimpleSearch",
        props: {
            searchPlaceholder: {
                type: String,
                default: "请输入关键字"
            },
            showExport:{
              type:Boolean,
              default:true
            }
        },
        data() {
            return {
                queryData: ""
            };
        },
        created() {
            //console.log(this.$listeners)
        },
        computed: {
            showButton() {
                return this.$listeners['searchFun'] || (this.$listeners['addFun'] && this.hasPermissions('Create')) || (this.$listeners['exportFun'] && this.hasPermissions('daochu'))
            }
        },
        methods: {
            query() {
                this.$emit("searchFun", this.queryData);
            },
            add() {
                this.$emit("addFun");
            },
            exportExcel() {
                this.$emit("exportFun", this.queryData);
            }
        }
    };
</script>
